<!DOCTYPE html>
<html lang="zh" style="font-size: 26.7312px;"></html>
<!-- 中文语言 字体大小*/ -->
  <head>
    <meta charset="UTF-8">
    <title>工大版教师节专属贺卡</title>
    <!--自动适应屏幕，且不可缩放-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <!--样式表和js文件导入-->
    <link rel="prefetch stylesheet" href="../static/css/style.css?v=1.0.10" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../static/css/weui.min.css">
  
    <script type="text/javascript" src="../static/js/weui.min.js"></script>
    <script src="../static/js/jquery-3.4.1.min.js"></script>
    <script type="text/javascript" src="../static/js/common.js"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
    <!--字体大小转为px-->
    <script>
      document.documentElement.style.fontSize = document.documentElement.clientWidth * 14 / 320 + 'px';
    </script>
  </head>

  <body>
    
    <div class="main">
      <div><img class="arrow left" style="transform: rotate(180deg)" src="../static/img/arrow.png" onclick="choose_left()" alt=""></div>
      <div class="show-place">
	 <p> 点击左右按钮选择样式 </p>
	 <br>
         <img class="card-img" id="show-img" src="../static/img/1.jpg">
      </div>
      <div><img class="arrow right" src="../static/img/arrow.png" onclick="choose_right()" alt=""></div>
    </div>

    <div class="info">
      <p style="color: black;font-size: 1.5rem;font-weight: bold;margin: 0rem 0 0rem">专属工大版教师节贺卡</p>
    </div>

    <div class="button-place">
         <img class="button-img" onclick="jump()" src="../static/img/button.png" alt=""></a>
    </div>
  </body>

  <script type="text/javascript">
    var winHeight = $(window).height();
    $("body").height(winHeight);
    var index=1;
    var card_num=8;

    function choose_left(){
      index = (index==1) ? card_num : index-1;
      $('#show-img').attr('src','../static/img/'+index+'.jpg');
    }
    function choose_right(){
      index = (index==card_num) ? 1 : index+1;
      $('#show-img').attr('src','../static/img/'+index+'.jpg');
    }
    function jump(){
      window.location.href = ("page1.html?cardImageNum="+index);
    }
    // 用于在加载时从url中获取参数
    function GetQueryString(name) {
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
      var r = window.location.search.substr(1).match(reg);
      // console.log(r) // for debug
      if (r != null)
          return decodeURI(r[2]);
      return null;
    }
    // 从url中取出参数
    // 选择的贺卡样式cardImageNum，称谓receiverText，内容contentText，书写人writerText
    function getData() {
      cardImageNum = GetQueryString("cardImageNum");
      receiverText = GetQueryString("receiverText");
      contentText = GetQueryString("contentText");
      writerText = GetQueryString("writerText");
    }
  </script>
  <script text="text/javascript">
    
    var images =new Array();
    function preload(){
      for(i=0; i<preload.arguments.length;i++){
        images[i] = new Image();
        images[i].src = preload.arguments[i];
      }
    }
    preload(
      "../static/img/1.jpg",
      "../static/img/2.jpg",
      "../static/img/3.jpg",
      "../static/img/4.jpg",
      "../static/img/5.jpg",
      "../static/img/6.jpg",
      "../static/img/7.jpg",
      "../static/img/8.jpg",
      // "../static/font/kaiti7000.TTF"   // 直接当作图片缓存
    )
  </script>
</html>
